import React from 'react'
import {
  View,
  StatusBar,
} from 'react-native'
import NaviBar from 'react-native-pure-navigation-bar';
import { Actions } from 'react-native-router-flux'
import config from '../../config'

const defaultNaviProps = {
  onLeft: () => { Actions.pop() },
  isTranslucent: true,
}

export const Container = ({ style, children, translucent = true, naviBarProps }) => {

  return (
    <View style={{ flex: 1, }}>
      <StatusBar backgroundColor={'transparent'}
        barStyle={'dark-content'}
        translucent={translucent}
      />

      {naviBarProps &&
        <NaviBar
          {...defaultNaviProps}
          {...naviBarProps}
        />
      }

      <View style={[config.commonStyle.container, style]}>
        {/* content */}
        {children}
      </View>
    </View>
  )
}
